<xsl:stylesheet version="1.1"
                xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
                xmlns="http://www.w3.org/2000/svg"
                xmlns:android="http://schemas.android.com/apk/res/android"
                xmlns:xlink="http://www.w3.org/1999/xlink"
                extension-element-prefixes="xlink">

    <xsl:param name="ghost-width"/>
    <xsl:param name="ghost-height"/>
    <xsl:param name="outline-width"/>
    <xsl:param name="body-fill"/>
    <xsl:param name="body-stroke"/>
    <xsl:param name="body-opacity"/>
    <xsl:param name="body"/>
    <xsl:param name="mouth"/>
    <xsl:param name="eyes"/>

    <xsl:output method="xml"/>

    <xsl:template match="/">

        <svg width="{$ghost-width}" height="{$ghost-height}" viewBox="0 0 {$ghost-width} {$ghost-height}">
            <g>
                <xsl:choose>
                    <xsl:when test="$body = 'cat'">
                        <xsl:variable name="head-height" select="$ghost-height div 3"/>
                        <ellipse cx="{$ghost-width div 2}" cy="{($ghost-height - $head-height) div 2}" rx="{$ghost-width div 2 - $outline-width}" ry="{$head-height div 2}"
                        fill="{$body-fill}" stroke="{$body-stroke}" stroke-width="{$outline-width}" fill-opacity="{$body-opacity}">
                            <animate attributeType="CSS" attributeName="fill-opacity"
                                   from="0" to="{$body-opacity}" dur="1s" />
                            <animate attributeType="CSS" attributeName="stroke-opacity"
                                   from="0" to="1" dur="1s" />
                        </ellipse>
                        <path
                            d="
                            M {$ghost-width div 2 + $outline-width}, {$ghost-height div 2}
                            L {$ghost-width * 0.75}, {$ghost-height - $outline-width}
                            L {$ghost-width div 4}, {$ghost-height - $outline-width}
                            L {$ghost-width div 2 - $outline-width}, {$ghost-height div 2}
                            "
                                fill="{$body-fill}" stroke="{$body-stroke}" stroke-width="{$outline-width}" fill-opacity="{$body-opacity}">
                            <animate attributeType="CSS" attributeName="fill-opacity"
                                   from="0" to="{$body-opacity}" dur="1s" />
                            <animate attributeType="CSS" attributeName="stroke-opacity"
                                   from="0" to="1" dur="1s" />
                        </path>
                        <line x1="{$ghost-width * 0.19}" y1="{$ghost-height * 0.40}" x2="{$outline-width}" y2="{$ghost-height * 0.45}" stroke="{$body-stroke}" stroke-width="{$outline-width}"/>
                        <line x1="{$ghost-width * 0.23}" y1="{$ghost-height * 0.45}" x2="{$ghost-width * 0.13}" y2="{$ghost-height * 0.52}" stroke="{$body-stroke}" stroke-width="{$outline-width}"/>
                        <g transform="translate({$ghost-width div 2},0) scale(-1,1) translate({-$ghost-width div 2},0)">
                        <line x1="{$ghost-width * 0.19}" y1="{$ghost-height * 0.40}" x2="{$outline-width}" y2="{$ghost-height * 0.45}" stroke="{$body-stroke}" stroke-width="{$outline-width}"/>
                        <line x1="{$ghost-width * 0.23}" y1="{$ghost-height * 0.45}" x2="{$ghost-width * 0.13}" y2="{$ghost-height * 0.52}" stroke="{$body-stroke}" stroke-width="{$outline-width}"/>
                        <path
                            d="
                            M {$ghost-width  * 0.22}, {$ghost-height div 2 - $head-height * 0.85}
                            L {$ghost-width * 0.20}, {$outline-width}
                            L {$ghost-width * 0.35}, {$ghost-height div 2 - $head-height * 0.92}
                            "
                                fill="{$body-fill}" stroke="{$body-stroke}" stroke-width="{$outline-width}" fill-opacity="{$body-opacity}">
                            <animate attributeType="CSS" attributeName="fill-opacity"
                                   from="0" to="{$body-opacity}" dur="1s" />
                            <animate attributeType="CSS" attributeName="stroke-opacity"
                                   from="0" to="1" dur="1s" />
                        </path>
                        </g>
                        <path
                            d="
                            M {$ghost-width  * 0.22}, {$ghost-height div 2 - $head-height * 0.85}
                            L {$ghost-width * 0.20}, {$outline-width}
                            L {$ghost-width * 0.35}, {$ghost-height div 2 - $head-height * 0.92}
                            "
                                fill="{$body-fill}" stroke="{$body-stroke}" stroke-width="{$outline-width}" fill-opacity="{$body-opacity}">
                            <animate attributeType="CSS" attributeName="fill-opacity"
                                   from="0" to="{$body-opacity}" dur="1s" />
                            <animate attributeType="CSS" attributeName="stroke-opacity"
                                   from="0" to="1" dur="1s" />
                        </path>
                    </xsl:when>
                    <xsl:otherwise>
                        <xsl:variable name="skirting" select="($ghost-width - $outline-width * 2) div 7"/>
                        <path
                                d="
                                M {$outline-width},{$ghost-width div 2 + $outline-width}
                                A {$ghost-width div 2 - $outline-width}, {$ghost-width div 2 - $outline-width} 0 0,1 {$ghost-width - $outline-width},{$ghost-width div 2 + $outline-width}
                                L {$ghost-width - $outline-width}, {$ghost-height - $outline-width - $skirting}
                                A {$skirting div 2},{$skirting div 2} 0 0,1 {$ghost-width - $outline-width - $skirting},{$ghost-height - $outline-width - $skirting}
                                A {$skirting div 2},{$skirting div 2} 0 0,0 {$ghost-width - $outline-width - $skirting*2},{$ghost-height - $outline-width - $skirting}
                                A {$skirting div 2},{$skirting div 2} 0 0,1 {$ghost-width - $outline-width - $skirting*3},{$ghost-height - $outline-width - $skirting}
                                A {$skirting div 2},{$skirting div 2} 0 0,0 {$ghost-width - $outline-width - $skirting*4},{$ghost-height - $outline-width - $skirting}
                                A {$skirting div 2},{$skirting div 2} 0 0,1 {$ghost-width - $outline-width - $skirting*5},{$ghost-height - $outline-width - $skirting}
                                A {$skirting div 2},{$skirting div 2} 0 0,0 {$ghost-width - $outline-width - $skirting*6},{$ghost-height - $outline-width - $skirting}
                                A {$skirting div 2},{$skirting div 2} 0 0,1 {$ghost-width - $outline-width - $skirting*7},{$ghost-height - $outline-width - $skirting}
                                z"
                                fill="{$body-fill}" stroke="{$body-stroke}" stroke-width="{$outline-width}" fill-opacity="{$body-opacity}">
                            <animate attributeType="CSS" attributeName="fill-opacity"
                                   from="0" to="{$body-opacity}" dur="1s" />
                            <animate attributeType="CSS" attributeName="stroke-opacity"
                                   from="0" to="1" dur="1s" />
                        </path>
                    </xsl:otherwise>
                </xsl:choose>
                <xsl:variable name="mouthy" select="$ghost-height * 0.65"/>
                <xsl:choose>
                    <xsl:when test="$mouth = 'lady'">
                        <xsl:variable name="mouth-width" select="$ghost-width div 5"/>
                        <xsl:variable name="mouth-height" select="$mouth-width * 0.8"/>
                        <path
                            d="
                            M {($ghost-width - $mouth-width)div 2}, {$mouthy}
                            A {$mouth-width div 4}, {$mouth-height div 4} 0 0,1 {$ghost-width div 2},{$mouthy - 1}
                            A {$mouth-width div 4}, {$mouth-height div 4} 0 0,1 {($ghost-width + $mouth-width) div 2},{$mouthy}
                            A {$mouth-width div 2}, {$mouth-height div 2} 0 0,1 {($ghost-width - $mouth-width)div 2},{$mouthy}
                            z" fill="red" stroke="black" stroke-width="1" stroke-opacity="{$body-opacity}" fill-opacity="{$body-opacity}" />
                    </xsl:when>
                    <xsl:when test="$mouth = 'happy'">
                        <xsl:variable name="mouth-width" select="$ghost-width div 2"/>
                        <xsl:variable name="mouth-height" select="$mouth-width * 0.8"/>
                        <path
                            d="
                            M {($ghost-width - $mouth-width)div 2}, {$mouthy - $mouth-height div 2}
                            L {($ghost-width + $mouth-width)div 2}, {$mouthy - $mouth-height div 2}
                            A {$mouth-width div 2}, {$mouth-height div 2} 0 0,1 {($ghost-width - $mouth-width)div 2},{$mouthy - $mouth-height div 2}
                            z" fill="black" stroke="black" stroke-width="1" stroke-opacity="{$body-opacity}" fill-opacity="{$body-opacity}" />
                    </xsl:when>
                </xsl:choose>
                <xsl:call-template name="eye">
                    <xsl:with-param name="x" select="$ghost-width div 4"/>
                    <xsl:with-param name="y" select="$ghost-height * 0.23"/>
                </xsl:call-template>
                <g transform="scale(-1,1)">
                    <xsl:call-template name="eye">
                        <xsl:with-param name="x" select="-$ghost-width * 3 div 4"/>
                        <xsl:with-param name="y" select="$ghost-height * 0.23"/>
                    </xsl:call-template>
                </g>
            </g>
        </svg>

    </xsl:template>

    <xsl:template name="eye">
        <xsl:param name="x"/>
        <xsl:param name="y"/>
        <xsl:choose>
            <xsl:when test="$eyes = 'lady'">
                <xsl:variable name="eye-width" select="$ghost-width div 5"/>
                <xsl:variable name="eye-height" select="$ghost-height div 5"/>
                <path
                    d="
                    M {$x}, {$y + $eye-height}
                    A {$eye-width div 2}, {$eye-height} 0 0,1 {$x + $eye-width},{$y + $eye-height}
                    z" fill="white" stroke="black" stroke-width="1" stroke-opacity="{$body-opacity}" fill-opacity="{$body-opacity}" />
            </xsl:when>
            <xsl:otherwise>
                <xsl:variable name="eye-width" select="$ghost-width div 5"/>
                <xsl:variable name="eye-height" select="$ghost-height div 5"/>
                <ellipse cx="{$x + $eye-width div 2}" cy="{$y + $eye-height div 2}" rx="{$eye-width div 2}" ry="{$eye-height div 2}" fill="black" stroke="{$body-stroke}" stroke-width="{$outline-width}"/>
            </xsl:otherwise>
        </xsl:choose>

    </xsl:template>

</xsl:stylesheet>